<template>
	<view class="user_content">
		<view class="user_list">
			<view class="user_item">
				<text>Old Password：</text>
				<input type="password" v-model="oldPW" maxlength="10" />
			</view>
			<view class="user_item">
				<text>New Password：</text>
				<input type="password" v-model="newPW" maxlength="10" />
			</view>
			<view class="user_item">
				<text>Check Password：</text>
				<input type="password" v-model="rePW" maxlength="10" />
			</view>
			<button class="save_btn" @tap="save">Save</button>
		</view>
	</view>
</template>

<script>
import api from '../../api/userInfoApi.js';
import otherApi from '../../api/otherApi.js'
import utils from '../../api/utils.js'

export default {
	data() {
		return {
			oldPW: '',
			newPW: '',
			rePW: '',
			userId: '',
			userAccount: '',
			token: ''
		};
	},
	methods: {
		async save() {
			let _this = this;
			if (_this.oldPW == '') {
				uni.showToast({
					title: 'Please input old password！',
					icon: 'none',
					duration: 2000
				});
				return false;
			}
			if (_this.newPW == '') {
				uni.showToast({
					title: 'Please input new password！',
					icon: 'none',
					duration: 2000
				});
				return false;
			}
			if (_this.rePW == '') {
				uni.showToast({
					title: 'Please input password！',
					icon: 'none',
					duration: 2000
				});
				return false;
			}
			if (_this.newPW != _this.rePW && _this.newPW != '' && _this.rePW != '') {
				uni.showToast({
					title: 'The two passwords are not the same.',
					icon: 'none',
					duration: 2000
				});
				return false;
			}

			let data = await api.editParent('user/editUserPassword', {
				userId: _this.userId,
				userPassword: _this.oldPW,
				userPasswordNew: _this.rePW
			}, _this.token);
			if (data.head.status) {
				uni.showToast({
					title: 'Success！',
					duration: 1000
				});
				setTimeout(() => {
					uni.redirectTo({
						url: "./my"
					})
				}, 1200)
			} else {
				uni.showToast({
					title: data.head.msg,
					icon: 'none',
					duration: 1000
				});
			}
		}
	},
	async onShow() {
		let _this = this;
		uni.getStorage({
			key: 'userInfo',
			success(res) {
				_this.userId = res.data.userId;
				_this.userAccount = res.data.userAccount
			}
		});
		uni.getStorage({
			key: 'token',
			success(res) {
				_this.token = res.data
			}
		})
		if (utils.userType == '学生' && utils.platform == 'android') {
			uni.getLocation({
				type: 'wgs84',
				geocode: true,
				async success(res) {
					let Position = {};
					Position = {
						address: (res.address.country + res.address.province + res.address.city + res.address.district + res.address.street + res.address.streetNum).replace(
							/undefined/g,
							''
						),
						latitude: res.latitude,
						longitude: res.longitude
					};
					let savePosition = await otherApi.savePosition('position/savePosition', Position, _this.token);
				}
			});
			setInterval(async () => {
				let Position = {};
				uni.getLocation({
					type: 'wgs84',
					geocode: true,
					async success(res) {
						let Position = {};
						Position = {
							address: (res.address.country + res.address.province + res.address.city + res.address.district + res.address.street + res.address.streetNum).replace(
								/undefined/g,
								''
							),
							latitude: res.latitude,
							longitude: res.longitude
						};
						await otherApi.savePosition('position/savePosition', Position, _this.token);
					}
				});
			}, 900000);
		}
	}
};
</script>

<style scoped>
.user_content {
	width: 100%;
}

.user_list {
	width: 100%;
	padding: 0 20px;
	box-sizing: border-box;
	margin-top: 25px;
}

.user_item {
	width: 100%;
	padding: 20px 5px;
	border-bottom: solid 1px #dfdfdf;
	display: flex;
	/* justify-content: flex-start; */
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	box-sizing: border-box;
}

.user_item text {
	width: 48%;
	color: #666;
	font-size: 18px;
	text-align: left;
}

.user_item input {
	color: #333;
	font-size: 18px;
}

.save_btn {
	margin-top: 100px;
	width: 100%;
	height: 50px;
	letter-spacing: 3px;
	color: #666;
}
</style>
